import React from 'react';
import ReactDOM from 'react-dom';
import About from './funcCom/about.js'
import Home from  './claCom/home.js'
import Eve from './claCom/eve.js'
import Pro from './claCom/pro.js'

import StaHook from './hooks/stahook.js'

import 'antd/dist/antd.css'; // or 'antd/dist/antd.less'
// ReactDOM.render(
//   <React.StrictMode>
//     <Button type="primary">按钮 </Button>
//     <div> hello react</div>
//     <About title="向下传递 title">
//       <p>插槽</p>
//     </About>
//     <Home title='传给类组件----'></Home>
//     <Eve></Eve>
//     <Pro></Pro>
//     <StaHook ></StaHook>
//   </React.StrictMode>,
//   document.getElementById('root')
// );

import Life from './components/life.js'
import Homes from './view/home.js'
import Propscon  from './components/propscon.js';
import Cont from './components/conc/content.js'
import Func from './components/func/func.js'
import Redu from './components/redux/rede.js'
import {HashRouter,Switch,Route,Redirect} from 'react-router-dom'

ReactDOM.render(
  <HashRouter>
    <Switch>
        <Redirect from='/' to='/home' exact />
        <Route path='/home'  render={()=>{
           return <Homes>
             <Redirect from='/home' to='/home/life' exact></Redirect>
            <Route path='/home/life' component={Life}></Route>
            <Route path='/home/props' component={Propscon}></Route>
            <Route path='/home/cont' component={Cont}></Route>
            <Route path='/home/hooks' component={Func} ></Route>
            <Route path='/home/redux' component={Redu} ></Route>
          </Homes>
        }
        }>
        </Route>
        <Route path='*' component={Homes}></Route>
    </Switch>
  </HashRouter>
  
,document.getElementById('root'))




